<template>
  <div>
    <el-table


      :data="ruleData"
      class="ruleTable"
      height="500px"
      style="width: 100%">
      <el-table-column
        label="ID"
        type="index"
        width="40">
      </el-table-column>
      <el-table-column
        align="center"
        label="规则名称"
        prop="OrderAutoPlanName"
        width="250">
        <template slot-scope="scope">
          <el-input :disabled="inputType" v-model="scope.row.OrderAutoPlanName"></el-input>
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        label="排程线体"
        width="150">
        <template slot-scope="scope">
          <el-select :disabled="inputType" placeholder="线体" v-model="scope.row.LineName">
            <el-option
              :key="item.BoardModelID"
              :label="item.Name"
              :value="item.LineId"
              v-for="(item,index) in linebodyData"
            >
            </el-option>
          </el-select>
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        label="最小板数"
       >
        <template slot-scope="scope">
          <el-input :disabled="inputType" v-model="scope.row.MinNum"></el-input>
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        label="最大板数"
        >
        <template slot-scope="scope">
          <el-input :disabled="inputType" v-model="scope.row.MaxNum"></el-input>
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        label="拼版模板"
        width="310">
        <template slot-scope="scope">
          <el-select :disabled="inputType" filterable placeholder="拼版模板" style="width: 250px"
                     v-model="scope.row.BoardName">
            <el-option
              :key="item.BoardModelID"
              :label="item.Name"
              :value="item.BoardModelID"
              v-for="(item,index) in boardModelData"
            ></el-option>
          </el-select>
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        label="是否启用"
        width="100">
        <template slot-scope="scope">
<!--          <el-select :disabled="inputType" placeholder="是否启用" v-model="scope.row.Status">-->
<!--            <el-option-->
<!--              :key="index"-->
<!--              :label="item.label"-->
<!--              :value="item.value"-->
<!--              v-for="(item,index) in options1"-->
<!--            ></el-option>-->
<!--          </el-select>-->
          <el-switch :disabled="inputType" :active-value="1" :inactive-value="0" v-model="scope.row.Status" ></el-switch>
        </template>
      </el-table-column>
      <el-table-column
        style="z-index: -100"

        align="center"
        label="优先级"
       >
        <template slot-scope="scope">
<!--          <el-select :disabled="inputType" placeholder="优先级" v-model="scope.row.Priority">-->
<!--            <el-option-->
<!--              :key="index"-->
<!--              :label="item.label"-->
<!--              :value="item.value"-->
<!--              v-for="(item,index) in options2"-->
<!--            ></el-option>-->
<!--          </el-select>-->
          <el-slider
            :disabled="inputType"
            v-model="scope.row.Priority"
            :step="1"
            :min="1"
            :max="2"
            show-stops>
          </el-slider>
        </template>
      </el-table-column>
      <el-table-column
        label="操作"
        width="200"
        align="center"
        fixed="right"
      >
        <template scope="scope">
          <el-button @click="edit(scope.row)" type="primary" size="small">编辑</el-button>
          <el-button @click="Remove(scope.row)" type="info" size="small">删除</el-button>
        </template>
      </el-table-column>
    </el-table>


  </div>
</template>
<script>
  import {
    removeOrderAutoPlan//删除排产规则设置

  } from '@/api/order'

  export default {
    props: {
      ruleData: {
        type: Array
      },
      innerVisible: {
        type: Boolean
      },
      linebodyData: { type: Array },
      boardModelData: { type: Array }
    },
    data() {
      return {
        options1: [
          {
            value: 0,
            label: '禁用'
          },
          {
            value: 1,
            label: '启用'
          }
        ],
        options2: [
          {
            value: 1,
            label: '1级'
          },
          {
            value: 2,
            label: '2级'
          },
          {
            value: 3,
            label: '3级'
          },
          {
            value: 4,
            label: '4级'
          }
        ],

        inputType: true
      }
    },

    methods: {

      Remove(row) {
        console.log(row.OrderAutoPlanId)
        this.$confirm('此操作将永久删除该规则，是否继续？', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          removeOrderAutoPlan({ orderAutoPlanId: row.OrderAutoPlanId }).then(res => {
            if (parseInt(res.Code) === 1) {
              this.$message({
                type: 'success',
                message: res.Message
              })
            }
            this.$parent.$parent.setrule()
          }).catch((e) => {
            this.$message.warning(e)
          })
        }).catch(() => {
        })

      },
      edit(row) {
        this.$emit('openEditDialog', true, row)
      }
    }
  }
</script>
<style lang="scss">

  .el-slider__button-wrapper{
    z-index: -100;
  }

  .ruleTable {
    /deep/ td {
      border: none !important;
    }
  }
</style>
<style lang="scss" scoped>

</style>
